<template>
	<u-navbar :leftIconSize="42" titleStyle="font-size:20px;font-weight:600" :autoBack="true" :placeholder='true'
		:title="titleMap[data.code]">
	</u-navbar>

	<view class="form-cart">
		<u--form labelWidth="140" labelPosition="left" :model="data['form']" :rules="{}" ref="formRef">
			<u-form-item label="手机号" prop="data.form.mobile" borderBottom>
				<view class="flex-jc-s-b">
					<u--input type="number" placeholder="请输入手机号" :maxlength="11" v-model="data['form'].mobile"
						border="none" :disabled="data.code !== 'reset'" disabledColor="#FFFFFF"></u--input>
					<text class="code-text" :style="data.codeInfo=='获取验证码'?{color:'#409EFF'}:{color:'#D3D3D3'}"
						@click="codeHandle">{{data.codeInfo}}</text>
				</view>
			</u-form-item>
			<u-form-item label="验证码" prop="data.form.captcha" borderBottom>
				<u--input type="number" placeholder="请输入验证码" :maxlength="6" v-model="data['form'].captcha"
					border="none"></u--input>
			</u-form-item>
			<u-form-item label="旧密码" prop="data.form.oldPassword" borderBottom v-if="data.code === 'edit'">
				<u--input type="password" placeholder="请输入旧密码" v-model="data['form'].oldPassword"
					border="none"></u--input>
			</u-form-item>
			<u-form-item label="新密码" prop="data.form.password" borderBottom>
				<u--input type="password" placeholder="请输入8-20位新密码，由数字和字母组成" v-model="data['form'].password"
					border="none"></u--input>
			</u-form-item>
			<u-form-item label="确认密码" prop="data.form.rePassword">
				<u--input type="password" placeholder="再次输入新密码" v-model="data['form'].rePassword"
					border="none"></u--input>
			</u-form-item>
		</u--form>
	</view>
	<view class="" style="position: fixed;bottom: 30px;left: 0;width: 100%;">
		<u-button type="primary" shape='circle' style="max-width: 600px;"
			:customStyle="{width: '92%',background:'linear-gradient(90deg, #23B2FF 0%, #409EFF 100%)',height:'44px','font-size':'17px',border:'none'}"
			@click='resettingHandle'>重置密码</u-button>
	</view>
</template>

<script setup>
	import {
		onMounted,
		reactive,
		ref,
		getCurrentInstance
	} from 'vue'
	import {
		coursCaptcha,
		resetPasswordApi,
		editPasswordApi
	} from '@/api/login.js'
	import {
		hidePartMobile
	} from '@/utils/check.js'
	import {
		onLoad
	} from "@dcloudio/uni-app";
	// import {
	// 	saleInfoApi
	// } from '../../index/const'
	const data = reactive({
		saleInfo: {},
		code: 'reset',
		form: {
			"mobile": "", //手机号
			"captcha": "", //验证码
			"password": "", //密码
			"rePassword": "", //确认密码
			"oldPassword": "", //旧密码
		},
		codeInfo: '获取验证码'
	})
	const titleMap = reactive({
		reset: '忘记密码',
		edit: '修改密码',
	})
	onLoad((options) => {
		console.log(options, 'options')
		data.code = options.code || 'reset'
		data.form.mobile = options.mobile || ''
	})
	onMounted(() => {
		if (data.code === 'edit') {
			getMobile()
		}
	})
	// const getMobile = () => {
	// 	saleInfoApi().then((res) => {
	// 		data.form.mobile = res.data.mobile
	// 	})
	// }
	const emit = defineEmits(['customBack'])
	const customBack = () => {
		emit('customBack')
	}
	const codeHandle = () => {
		let typeCode = data.code === 'reset' ? 'resetPassword' : 'updatePassword'
		if (data.codeInfo == '获取验证码') {
			coursCaptcha({
				mobile: data['form'].mobile,
				typeCode: typeCode
			}).then((res) => {
				uni.$u.toast('验证码已成功发送，请注意查看')
				let codeTime = 60
				let codeSetInterval = setInterval(() => {
					codeTime--
					data.codeInfo = codeTime + 's'
					if (codeTime == 0) {
						clearInterval(codeSetInterval);
						data.codeInfo = '获取验证码'
					}
				}, 1000)
			})
		}
	}
	const resettingHandle = () => {
		if (data.form.password !== data.form.rePassword) {
			uni.$u.toast('请核对两次密码是否一致');
			return
		}
		if (data.code === 'reset') {
			resetPasswordApi(data.form).then((res) => {
				uni.showToast({
					title: res.msg,
					duration: 1200,
					icon: "none"
				})
				goBack()
			})
		} else if (data.code === 'edit') {
			editPasswordApi(data.form).then((res) => {
				uni.showToast({
					title: res.msg,
					duration: 1200,
					icon: "none"
				})
				goBack()
			})
		}
	}
	const goBack = () => {
		setTimeout(() => {
			uni.navigateBack({
				delta: 1
			})
		}, 500)
	}
</script>

<style lang="scss" scoped>
	.form-cart {
		padding: 0 15px;
		background-color: #fff;
		width: calc(100% - 30px);
		margin: 15px auto 0 auto;
		border-radius: 8px;
	}

	.code-text {
		font-size: 14px;
		font-family: PingFang SC-Medium, PingFang SC;
		color: #409EFF;
	}
</style>